<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<title>Hello H5+</title>
		<script src="../../js/H5+.js"></script>
		<script src="https://cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
		<script type="text/javascript">
		</script>
		<link rel="stylesheet" href="../../css/mui.min.css">
		<script src="../../js/mui.min.js"></script>
		<script>
			(function(doc, win) {
				        var html = doc.getElementsByTagName("html")[0],
				        // orientationchange->手机屏幕转屏事件
				        // resize->页面大小改变事件(一边pc端有用)
				            reEvt = "orientationchange" in win ? "orientationchange" : "resize",
				            reFontSize = function() {
				                var clientW = doc.documentElement.clientWidth || doc.body.clientWidth;
				                if(!clientW) {
				                    return;
				                }
				                html.style.fontSize = 100 * (clientW / 420) + "px";
				        }
				        win.addEventListener(reEvt, reFontSize);
				
				        // DOMContentLoaded->dom加载完就执行,onload要dom/css/js都加载完才执行
				        doc.addEventListener("DOMContentLoaded", reFontSize);
				    })(document, window);
			</script>
		<style type="text/css">
			* {
				padding: 0rem;
				margin: 0rem;
			}

			body {
				margin: 0rem;
				padding: 0px;
				overflow: hidden;
			}

			.mui-content {
				background: #FFFFFF;
				padding: 0.05rem;
				padding-bottom: 0rem;
			}

			.formbtn_box {
				padding: 0px 0.05rem;
				border-bottom: 1px solid #eee;
				padding-bottom: 0.05rem;
				height: 0.4rem;
				padding-left: 0.15rem;
			}

			.inserFromBox {
				padding: 0px 0.15rem;
			}

			.inserFromBox input[type='text'],
			.inserFromBox input[type='number'] {
				display: inline-block;
				font-size: 0.14rem;
				border-radius: 0rem;
				text-align: right;
				border: none;
				width: calc(80% - 0.3rem);
				color: #000000;
				font-size: 0.15rem;
			}

			.inserFromBox ul li>span {
				color: #999999;
				width: 19.99%;
				display: inline-block;
			}

			.inserFromBox {
				padding: 0rem;
				margin: 0rem;
			}

			.inserFromBox ul li {
				font-size: 0.15rem;
				display: block;
				border-bottom: 1px solid #EEEEEE;
				margin: 0rem;
				height: 0.5rem;
				line-height: 0.5rem;
				margin-left: 0.15rem;
				display: block;
				overflow: hidden;
			}

			.tag_Type {
				display: inline-block;
				width: 80%;
				text-align: right;
				padding-right: 0.15rem;
			}

			.tag_Type lable {
				border-radius: 5px;
				display: inline;
				border: 1px solid #47BAFE;
				white-space: nowrap;
				color: #47BAFE;
				font-size: 0.12rem;
				padding: 0.05rem 0.1rem;
			}

			.type_active {
				background: #47BAFE;
				color: #FFFFFF !important;
			}

			.type_active2 {
				background: #47BAFE;
				color: #FFFFFF !important;
			}
			textarea{
				    padding: 0px;
					margin: 0px;
				  width: 70%;
					float: right;
					height: 70px;
					padding: 10px;
					font-size: 15px;
					text-align: right;
					color: #999999;
					border: none !important;
						}
			#setYes{
				background: #47BAFE;
				border-color: #47BAFE;
			}
			#setYes:active{
				background: #0062CC;
				border-color: #0062CC;
			}
		</style>
	</head>
	<body>
		<div class="mui-content" style="position: relative;">

			<!--  <div class="formbtn_box"> 
					   <img id="imgTx" src="../../images/mrtxF.jpg" style="float: left;"  width="35px" height="35px" alt="">
					   &nbsp; 
			<span id="customername" style="color: #999999;height: 0.4rem; line-height: 0.4rem; display: inline-block; float: left;margin-left: 0.05rem;">李艳艳</span>
			  </div> -->
			<p></p>
			<div class="inserFromBox">
				<h4 style="margin-left: 0.1rem;border-bottom: 1px solid #EEEEEE;padding-bottom: 0.1rem;color: #545454;">填写产品信息
					<span id="getNo" style="float: right;margin-top: 0rem;font-size: 0.35rem;transform: translateY(-0.1rem);" class="mui-icon mui-icon-closeempty"></span>
				</h4>
				<ul class="ulBox">
					<li style="clear: both;"><span>产品</span><input type="text" class="inpt_text" style="width: 80%;" id="CPName"
						 placeholder="请输入购买的产品名称"></li>
					<li  class="mui-input-row" style="margin-top: 0.05rem;">
							<span >类型</span>
							<a class="mui-navigate-right" style="width:70%;    display: inline-block;">
									<select class="mui-h5" id="tag_Type"  style="color:#999999;margin:0rem;direction: rtl;font-size: 0.15rem;">
										<option >请选择</option>
										<option  value="意外险">意外险</option>
										<option  value="重疾险">重疾险</option>
										<option  value="健康险">健康险</option>
										<option  value="终身寿险">终身寿险</option>
										<option  value="百万医疗">百万医疗</option>
										<option  value="定期寿险">定期寿险</option>
										<option  value="年金险">年金险</option>

									</select>
							</a>

					</li>
					<li><span>保额</span><input id="limit" class="inpt_text" type="number" placeholder="请输入保险的保额">元</li>
					<li><span>保费</span><input type="number" style="width: calc(80% - 0.4rem);padding: 0.05rem;" class="inpt_text" id="Money" placeholder="请输入产品的费用">元/年</li>
					<li><span>保险期限</span><input type="number" class="inpt_text" id="datetime" placeholder="请输入保险期限">年</li>
					<li style=""><span >被保人</span><div class="tag_Type tag_Type2 ">
							<lable value="1">自己</lable>
							<lable value="2">配偶</lable>
							<lable value="3">父母</lable>
							<lable value="4">子女</lable>
							<lable value="5">其他</lable>
						</div>

					</li>
					<li  style="height: auto !important;margin-left: 0.05rem;"><span  style="padding-left: 0.1rem;">保障内容</span>
					<textarea id="product_cover" rows="2" style="font-size: 0.15rem !important;" placeholder="请输入产品保障内容" ></textarea>
					</li>
				
				
				<!-- 	<input type="text" class="inpt_text" style="width: 80%;" id="CPName"
					 placeholder="请输入产品保障内容"></li> -->
				</ul>


			</div>
			<div>

			</div>
		</div>
		<br>
		<button type="button" class="mui-btn mui-btn-primary" style="width: 70%;margin-left: 15%; " id="setYes">完成</button>
		<script>
			var custId;
			var salesId;
			document.getElementById("getNo").addEventListener("tap", function() {
				mui.back();
			})
			
			$(".tag_Type2 lable").on("tap", function() {
				$(".tag_Type2 lable").removeClass("type_active2");
				$(this).addClass("type_active2");
			})
			document.getElementById("setYes").addEventListener("tap", function() { //传值给客户详情页并关闭当前页
				let webviewCustomer = plus.webview.getWebviewById("customerDetail");
				let CPName = document.getElementById("CPName").value;
				let limit = document.getElementById("limit").value;
				let datetime = document.getElementById("datetime").value;
				let Money = document.getElementById("Money").value;
				let typeValue = $(".type_active").attr("value");
				let product_cover = document.getElementById("product_cover").value;
				   let obj=document.getElementById("tag_Type");
				var index=obj.selectedIndex;
				let text_type=obj.options[index].text;
				let peopleValue = $(".type_active2").attr("value");
				let text_people = "";
				switch (parseInt(peopleValue)) {
					case 1:
						text_people = "自己";
						break;
					case 2:
						text_people = "配偶";
						break;
					case 3:
						text_people = "父母";
						break;
					case 4:
						text_people = "子女";
						break;
					case 5:
						text_people = "其他";
							break;
					default:
						break;
				}
				if (CPName == "" || limit == "" || datetime == "" || text_people == "" || Money == "") {
					mui.toast("请填写完整");
					return;
				}
				if(text_type == "请选择"){
					mui.toast("请选择产品类型");
					return;
				}
				mui.post('http://118.25.184.62:8000/cmdb/insertProductByCustID/', {
					sales_id: salesId,
					cust_id: custId,
					product_nm: CPName,
					product_beneficial: text_people,
					product_type: text_type,
					product_premium: limit,
					product_fee: Money,
					product_period: datetime,
					 product_cover:product_cover
				}, function(r) {
					if (r.ERROR_CODE == "SUCCESS") {
						mui.fire(webviewCustomer, 'shuaxin', {});
						mui.back();
					}
				}, 'json');

			})

			let inpt_text = document.getElementsByClassName("inpt_text");
			let iss = 0;
			for (let i = 0; i < inpt_text.length; i++) {

				// inpt_text[i].addEventListener("tap", function() {
				// 	if (iss == 0) {
				// 		plus.webview.currentWebview().setStyle({
				// 			// top:0,
				// 			height: document.documentElement.clientHeight || document.body.clientHeight
				// 		});
				// 		iss = 1;
				// 	} else {
				// 		plus.webview.currentWebview().setStyle({
				// 			height: document.documentElement.clientHeight || document.body.clientHeight,
				// 		});
				// 	}
				// })
			}
			mui.plusReady(function() {
			
				
				// plus.webview.currentWebview().setStyle({
				//  	width: document.documentElement.clientHeight|| document.body.clientHeight
				//  });
			})
			document.addEventListener("getName", function(e) {
				// e.detail.name
				custId = e.detail.cust_id;
				salesId = e.detail.sales_id;
				// document.getElementById("customername").innerText=e.detail.name;
				// document.getElementById("imgTx").setAttribute("src",e.detail.img);
			})
		</script>
	</body>
</html>
